<template>
  <div class="kd-solid">
    <div class="flex">
      <!-- 左侧-->
      <div class="flex1">
        <div class="flex align-center">
          <div class="kd_left">图片</div>
          <div
            class="kd_right flex align-center"
            style="padding-top: 0; padding-bottom: 0"
          >
            <a-image
              :width="40"
              :height="40"
              :src="form.thumb_url"
              v-if="form.thumb_url"
            />
            <div class="margin-left-15">
              <a-upload
                name="attachment"
                v-model:file-list="images"
                :action="uploadUrl"
                :limit="1"
                list-type="picture-card"
                @change="uploadHandler"
                :show-upload-list="false"
              >
                <!-- <a-image :width="40" :height="40" :src="form.thumb_url" v-if="form.thumb_url" /> -->
                <div class="ant-upload-text">上传</div>
              </a-upload>
            </div>
          </div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">条码</div>
          <div class="kd_right">{{ info.bar_code || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">小类</div>
          <div class="kd_right">{{ info.subclass_code_name || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">品类</div>
          <div class="kd_right">{{ info.classes_code_name || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">成色</div>
          <div class="kd_right">{{ info.quality_code_name || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">货品名称</div>
          <div class="kd_right">{{ info.name || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">数量</div>
          <!-- <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              v-model:value="info.num"
              :min="1"
              all-clear
			  disabled
              placeholder="请输入"
            />
          </div> -->
          <div class="kd_right">{{ info.num || '' }}</div>
          <span class="kd_right_text">件</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">货重</div>
          <div class="kd_right">{{ info.piece_weight || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left required">净金重</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              :min="1"
              v-model:value="form.gold_weight"
              all-clear
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text">g</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left required">销售金价</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              placeholder="请输入"
              :min="1"
              v-model:value="form.sales_gold_price"
            />
          </div>
          <span class="kd_right_text">元/g</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left required">销售工费</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              placeholder="请输入"
              :min="1"
              v-model:value="form.sales_labor"
            />
          </div>
          <span class="kd_right_text"
            >元/
            <template v-if="info.labor_type == 1">g</template>
            <template v-if="info.labor_type == 2">件</template>
          </span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">销售标记</div>
          <div class="kd_right flex1 flex align-center">
            <a-select
              class="kd_inp flex1"
              optionFilterProp="label"
              :options="signOptions"
              allow-clear
              placeholder="请选择"
              v-model:value="form.sales_tag_code"
            />
          </div>
        </div>
      </div>
      <!-- 右侧 -->
      <div class="flex1">
        <div class="flex align-center">
          <div class="kd_left">标签价</div>
          <div class="kd_right flex1">{{ info.sticker_price || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">原售价</div>
          <div class="kd_right flex1">{{ form.original_amount || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">实售价</div>
          <div class="kd_right flex1">{{ form.real_amount || '' }}</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">固定折扣</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              placeholder="请输入"
              v-model:value="form.regular_discount"
            />
          </div>
          <span class="kd_right_text">%</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">卡券编号</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text">选择</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">卡券详情</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text"></span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">积分抵扣</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              v-model:value="form.points_deduction"
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text">元</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">抹零</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              v-model:value="form.small_change"
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text">元</span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">实售折扣</div>
          <div class="kd_right flex1">{{ form.real_discount || 0 }}%</div>
        </div>
        <div class="flex align-center">
          <div class="kd_left">积分扣减</div>
          <div class="kd_right flex1">
            <a-input
              type="number"
              class="kd_inp"
              all-clear
              v-model:value="form.points"
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text"></span>
        </div>
        <div class="flex align-center">
          <div class="kd_left">单件备注</div>
          <div class="kd_right flex1">
            <a-input
              type="text"
              class="kd_inp"
              all-clear
              v-model:value="form.note"
              placeholder="请输入"
            />
          </div>
          <span class="kd_right_text"></span>
        </div>
        <div class="flex align-center">
          <div class="kd_left"></div>
          <div class="kd_right flex1"></div>
        </div>
        <div class="flex align-center">
          <div class="kd_left"></div>
          <div class="kd_right flex1"></div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
  import { ref, unref, reactive, onMounted, watch } from 'vue';
  import {
    UserOutlined,
    PlusSquareOutlined,
    CloseCircleFilled
  } from '@ant-design/icons-vue';
  import { Modal, message } from 'ant-design-vue';
  import { useRouter } from 'vue-router';
  import { uploadUrl } from '@/config/setting';
  import {
    salesman_list,
    store_team,
    get_note_list,
    jewelry_order,
    been_order,
    del_been_order,
    go_pay,
    get_goods_details
  } from '@/api/order/order/jewelry_order';
  import { setting_list } from '@/api/setting/cashier_setting';
  import { get_list } from '@/api/setting/sales_subject';
  import { goods_info } from '@/api/jewelry/goods_info';
  import { get_price } from '@/api/setting/tenant_price';
  import { add } from '@/api/member/get_list';
  import { pay } from '@/api/order/pay';

  const emit = defineEmits(['get_been_order']);

  const form = reactive({
    order_sn: '',
    member_id: '',
    goods_code: '',
    thumb: '',
    gold_weight: '', //净金重
    sales_gold_price: '', //销售金价
    sales_labor: '', //销售工费
    regular_discount: 100,
    coupon_id: '',
    points: '',
    points_deduction: '',
    small_change: 0, //抹零
    small_change2: 0, //整单折扣抹零
    small_change3: 0, //整单抹零
    real_discount: '', //实售折扣
    original_amount: '', //原售价
    real_amount: '', //实售价
    sales_tag_code: null,
    note: ''
  });
  const info = ref({});
  const thumb_url = ref(null);
  const signOptions = ref([]);

  const sales_gold_price_edit = ref(false);
  const sales_labor_edit = ref(false);
  //收银台设置
  const setting = ref({});

  // 图片上传
  const images = ref([]);
  const uploadHandler = (infos) => {
    if (infos && infos.file && infos.file.response) {
      const data = infos.file.response.data;
      form.thumb_url = data.path;
      form.thumb = data.id.toString();
    }
  };

  watch(
    () => [
      form.gold_weight,
      form.sales_gold_price,
      form.sales_labor,
      form.small_change,
      form.points,
      form.points_deduction,
      form.regular_discount
    ],
    (newValue, oldValue) => {
      console.log(
        'newValue===',
        form.sales_gold_price,
        setting.value.gram_min_discount
      );
      if (form.sales_gold_price && setting.value.gram_min_discount) {
        if (
          Number(form.sales_gold_price) <
          Number(setting.value.gram_min_discount)
        ) {
          message.warn(`销售金价不能低于${setting.value.gram_min_discount}`);
        }
      }
      /* if(form.real_amount && info.value.sticker_price){
		  if(Number(form.real_amount) < Number(info.value.sticker_price)*Number(setting.value.piece_min_discount)/10){
			  message.warn(`实售价不能低于${setting.value.piece_min_discount}折`)
		  }
	  } */
      js_yuan_price();
      js_shi_price();
      js_shizhe_price();
    }
  );

  const js_yuan_price = () => {
    if (info.value.labor_type == 1) {
      /* -------按克------- */
      //计算原售价
      form.original_amount = (
        Number(form.gold_weight) * Number(form.sales_gold_price) +
        Number(form.gold_weight) * Number(form.sales_labor) +
        Number(info.value.sticker_price)
      ).toFixed(2);
    } else {
      /* -------按件------- */
      //计算原售价
      form.original_amount = (
        Number(form.gold_weight) * Number(form.sales_gold_price) +
        Number(form.sales_labor) +
        Number(info.value.sticker_price)
      ).toFixed(2);
    }
  };
  const js_shi_price = () => {
    //实售价：最终金重×手改销售金价+最终金重×最终工费原售价（工费按克，按件的话直接加上工费即可）+标签价-抹零-卡券-积分兑换
    if (info.value.labor_type == 1) {
      /* -------按克------- */
      //计算实售价
      form.real_amount = (
        (
          (Number(form.gold_weight) * Number(form.sales_gold_price) +
            Number(form.gold_weight) * Number(form.sales_labor) +
            Number(info.value.sticker_price)) *
          (Number(form.regular_discount) / 100)
        ).toFixed(2) -
        Number(form.small_change) -
        Number(form.points_deduction)
      ).toFixed(2);
    } else {
      /* -------按件------- */
      //计算实售价
      form.real_amount = (
        (
          (Number(form.gold_weight) * Number(form.sales_gold_price) +
            Number(form.sales_labor) +
            Number(info.value.sticker_price)) *
          (Number(form.regular_discount) / 100)
        ).toFixed(2) -
        Number(form.small_change) -
        Number(form.points_deduction)
      ).toFixed(2);
    }
  };
  const js_shizhe_price = () => {
    //计算实售折扣
    form.real_discount = (
      (Number(form.real_amount) / Number(form.original_amount)) *
      100
    ).toFixed(2);
  };

  onMounted(() => {
    get_list({
      page: 1,
      page_size: 99999,
      filters: {
        type: 'sales'
      }
    }).then((res) => {
      res.list.forEach((item) => {
        signOptions.value.push({
          label: item.name,
          value: item.code
        });
      });
    });

    setting_list().then((res) => {
      console.log('收银台设置', res);
      setting.value = res.data;
    });
  });
  const getPrice = (val) => {
    get_price({
      quality_code: val
    }).then((res) => {
      form.sales_gold_price = res.sales_price;
      if (info.value.retail_type == 2) {
        //零售方式按件， 销售金价为0
        form.sales_gold_price = 0;
      }
    });
  };
  const search = (val) => {
    get_goods_details({
      bar_code: val
    })
      .then(async (res) => {
        //数据初始化
        reset();

        res.sku_info.forEach((item) => {
          if (
            item.column_type == 'select' ||
            item.column_type == 'selectajax' ||
            item.column_type == 'selectajaxlike'
          ) {
            res[item.column] = item.value;
            res[item.column + '_name'] = item.value_name;
          } else {
            res[item.column] = item.value;
          }
        });
        info.value = res;
        console.log('info.value=1111===', info.value);
        form.goods_code = res.code;
        form.thumb = res.thumb;
        form.thumb_url = res.thumb_url;
        form.gold_weight = res.gold_weight;
        form.sales_labor = res.labour_price;
        getPrice(info.value.quality_code);
      })
      .catch((e) => {
        message.error(e);
      });
  };

  const getDetail = (val) => {
    info.value = val;
    info.value.labor_type = val.detail.labor_type;
    console.log('info.value=2222===', val);
    form.order_sn = val.order_sn;
    form.goods_code = val.goods_code;
    form.thumb = val.thumb;
    form.thumb_url = val.thumb_url;
    form.gold_weight = val.gold_weight;
    form.sales_labor = val.sales_labor;
    form.regular_discount = val.regular_discount;
    form.coupon_id = val.coupon_id;
    form.points = val.points;
    form.points_deduction = val.points_deduction;
    form.small_change1 = val.small_change;
    form.small_change2 = val.small_change2;
    form.small_change3 = val.small_change3;
    form.small_change =
      Number(val.small_change) +
      Number(val.small_change2) +
      Number(val.small_change3);
    form.real_amount = val.real_amount;
    form.sales_tag_code = val.sales_tag_code;
    form.note = val.note;
    form.sales_gold_price = val.sales_gold_price;
    if (val.retail_type == 2) {
      //零售方式按件， 销售金价为0
      form.sales_gold_price = 0;
    }

    //getPrice(info.value.info.quality_code);
  };
  const getMemberId = (id) => {
    form.member_id = id;
  };
  const save = () => {
    if (info.value.num < 1) {
      return message.error('货品已售出');
    }
    jewelry_order(form)
      .then((res) => {
        emit('get_been_order');
        reset();
        message.success(res.msg);
      })
      .catch((e) => {
        message.error(e);
      });
  };

  const reset = () => {
    Object.keys(info.value).forEach((key) => {
      info.value[key] = '';
    });
    Object.keys(form).forEach((key) => {
      if (key != 'member_id') {
        form[key] = null;
      }
    });
    form.regular_discount = 100;
  };

  defineExpose({
    search,
    getDetail,
    getMemberId,
    save,
    reset
  });
</script>

<style lang="less" scoped>
  :deep(.ant-upload.ant-upload-select-picture-card) {
    width: 40px;
    height: 40px;
    margin: 0;
  }
</style>
